.app__body {
    .react-select {
        .a11y--focused {
            box-shadow: none;
        }
    }

    .react-select__control--is-focused {
        box-shadow: 0 0 0 1px v(button-bg);
        border-color: v(button-bg);

        &:hover {
            box-shadow: 0 0 0 1px v(button-bg);
        }
    }

    .react-select__value-container {
        padding: 2px 10px;
    }

    .react-select__multi-value {
        align-items: center;
        background: var(--center-channel-color-08);
        padding: 2px;
        border-radius: 16px;
        color: var(--center-channel-color);
        margin: 4px;
        &:nth-last-child(2) {
            margin: 4px 0px 4px 4px;
        }
    }

    .react-select__multi-value__remove {
        cursor: pointer;
        span {
            height: 16px;
            width: 16px;
            display: flex;
        }
        &:hover {
            background: none;
        }
        svg {
            height: 16px;
            width: 16px;
            fill: var(--center-channel-color-64);
            &:hover {
                fill: var(--center-channel-color-80);
            }
            opacity: .6;
        }
    }

    .react-select__control {
        background: v(center-channel-bg);
        border-color: v(center-channel-color-20);
        height: 36px;
        min-height: 36px;

        &.react-select-auto {
            height: auto;
        }

        &:hover {
            border-color: v(center-channel-color-40);

            .react-select__indicator {
                opacity: .8;
            }
        }
    }

    .react-select__indicator-separator {
        background-color: v(center-channel-color);
        opacity: .4;
    }

    .react-select__indicator {
        @include single-transition(opacity, .2s, ease);
        color: inherit;
        padding: 7px 8px;
        opacity: .4;
    }

    .react-select__single-value {
        color: inherit;
    }

    .react-select__input {
        color: v(center-channel-color);
    }

    .react-select__menu {
        background: v(center-channel-bg);
    }

    .react-select__menu-list {
        border: 1px solid v(center-channel-color-20);
        border-radius: 4px;
    }

    .react-select__option--is-focused {
        background: v(button-bg-24);
    }

    .react-select__option--is-selected {
        background: v(button-bg);
        color: v(button-color);
    }

    .react-select-top {
        .react-select__menu {
            top: auto;
            bottom: 100%;
        }
    }
}